<template>
  <div class="edit">
    <el-form ref="ruleForm" :rules="rules" :model="formData">
      <el-form-item :label="$t('configLazyLoad.dicConfig.dicName')" prop="name">
        <el-input v-model.trim="formData.name" :maxlength="25"></el-input>
      </el-form-item>
      <el-form-item :label="$t('configLazyLoad.dicConfig.cascade')">
        <el-radio-group v-model.trim="formData.cascade">
          <el-radio :label="'1'">{{$t('configLazyLoad.dicConfig.grade1')}}</el-radio>
          <el-radio :label="'2'">{{$t('configLazyLoad.dicConfig.grade2')}}</el-radio>
          <el-radio :label="'3'">{{$t('configLazyLoad.dicConfig.grade3')}}</el-radio>
          <el-radio :label="'4'">{{$t('configLazyLoad.dicConfig.grade4')}}</el-radio>
          <el-radio :label="'5'">{{$t('configLazyLoad.dicConfig.grade5')}}</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" class="primary_btn fr" :disabled="submitDisabled" @click="onSubmit">{{$t('public.save')}}</el-button>
        <el-button  class="primary_btn fr cancel" @click="cancel">{{$t('public.cancel')}}</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>
<script>
//  import {getCache} from '@/utils/m7Utils'
  export default {
    name: 'dicAdd',
    data () {
      return {
        submitDisabled: false,
        rules: {
          name: [
            { required: true, message: this.$t('validate.required'), trigger: 'blur' }
          ]
        }
      }
    },
    props: {
      editOrAddForm: Object,
      isNewDic: Boolean
    },
    components: {},
    computed: {
      formData () {
        return this.editOrAddForm || {}
      }
    },
    methods: {
      cancel () {
        this.$emit('refresh')
      },
      onSubmit () {
        let isexistence = false
        this.submitDisabled = true
        this.$store.dispatch('getCache', {type: 'options', loadFromServer: true}).then((res) => {
          res.forEach((item) => {
            if (item._id === this.formData._id) {
              return true
            }
            if (item.name === this.formData.name) {
              isexistence = true
            }
          })
          if (isexistence) {
            this.$message.error(this.$t('configLazyLoad.dicConfig.dicError3'))
            this.submitDisabled = false
            return
          }
          if (this.formData.name === this.$t('qualityCheck.satisfactionSurveyOptions')) {
            this.$message.error(this.$t('configLazyLoad.dicConfig.dicError4'))
            this.submitDisabled = false
            return
          }
          if (this.formData.name) {
            if (!this.isNewDic) {
              this.$store.dispatch('updateDic', this.formData).then((res) => {
                this.submitDisabled = false
                if (res.success) {
                  this.$message.success(this.$t('configLazyLoad.qualityCheck.saveSuccess'))
                  this.$store.dispatch('updateCache', { type: 'options', id: this.formData._id, data: res.data })
                  this.$emit('refresh')
                }
              })
            } else {
              delete this.formData._id
              this.$store.dispatch('addDic', this.formData).then((res) => {
                this.submitDisabled = false
                if (res.success) {
                  this.$message.success(this.$t('configLazyLoad.qualityCheck.addSuccess'))
                  this.$store.dispatch('addCache', { type: 'options', data: res.data })
                  this.$emit('refresh')
                }
              })
            }
          } else {
            this.$message.error(this.$t('configLazyLoad.dicConfig.dicError9'))
          }
        })
      }
    },
    watch: {
//      formData () {
//        this.$refs.ruleForm.resetFields()
//      }
    },
    beforeMount () {
    }
  }
</script>

<style lang="stylus" scoped>
  .edit
    padding 20px
  .el-form
    width 60%
    .cancel
      margin-right 20px
</style>
